import React, { useState } from 'react';
import { Text, View, StyleSheet, Dimensions, Button, Alert, TouchableOpacity, TouchableWithoutFeedback } from 'react-native';
import { Platform, TextInput, TouchableHighlight } from 'react-native';
export default function Index() {
    /**
     * View,SafeAreaView(安全区域滚动),ScrollView(horizontal水平滚动)
     * @description  ScrollView安卓端有滚动不到底的问题，加个View设置高度解决
     */

    // if (Platform.OS === 'android') {
    //     alert('当前是安卓应用');
    // } else {
    //     alert('当前是IOS应用');
    // }

    const [name, setName] = useState();
    return (
        <View>
            <Text> textInComponent </Text>
            <TextInput
                placeholder="请输入内容"
                style={[Styles.input]}
                value={name}
                onChangeText={(val) => setName(val)}
            />
            <Button
                title="登录"
                onPress={() => {
                    alert(name);
                }}
            />

            <TextInput
                // 点击输入框调起的键盘类型
                keyboardType="number-pad"
                style={[Styles.input]}
            />

            <View>
                <TouchableHighlight
                    onPress={() => Alert.alert('点击了按钮')}
                >
                    <View>
                        <Text>触碰高亮</Text>
                    </View>
                </TouchableHighlight>
                <TouchableOpacity >
                    <View>
                        <Text>触碰透明度变化</Text>
                    </View>
                </TouchableOpacity>
                <TouchableWithoutFeedback>
                    <View>
                        <Text>触碰无响应</Text>
                    </View>
                </TouchableWithoutFeedback>
            </View>
        </View>
    );
}
const Styles = StyleSheet.create({
    input: {
        height: 20,
        width: Dimensions.get('window').width,
        borderWidth: 1,
        borderColor: 'red',
        color: 'black',
    },
});
